<!DOCTYPE html>
<html lang="en">

	<head>
		<title>重庆农气-运行监控子系统</title>
		<meta charset="UTF-8" />
		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
		<link rel="stylesheet" href="css/bootstrap.min.css" />
		<link rel="stylesheet" href="css/bootstrap-responsive.min.css" />
		<link rel="stylesheet" href="css/fullcalendar.css" />
		<link rel="stylesheet" href="css/matrix-style.css" />
		<link rel="stylesheet" href="css/matrix-media.css" />
		<link href="font-awesome/css/font-awesome.css" rel="stylesheet" />
		<link rel="stylesheet" href="css/jquery.gritter.css" />
		<link rel="stylesheet" href="css/bootstrap-responsive.min.css" />
		<link rel="stylesheet" href="css/monitor.css" />
		<link rel="stylesheet" href="css/box_style.css" />
		<link rel="stylesheet" href="css/index.css" />
		<style>	
			body{line-height: inherit;}
			#content{padding-bottom: 0;}
			#footer{padding: 0;height: 50px;line-height: 50px;background-color: #eeeeee;}
			.nav{margin-bottom: 0;}
			.align-center {text-align: center;}
			.more{margin: 0;margin-top: 10px;}
			.row-fluid:last-child{margin-bottom: 10px;}
		</style>
	</head>
	<body class="container">
		<div class="header">
			<div class="top"></div>
			<ul class="nav">
				<li><a href="index.html">首页</a></li>
				<li><a href="temp.html">气温监测</a></li>
				<li><a href="precipitation.html">降水监测</a></li>
				<li><a href="soil.html">墒情监测</a></li>
				<li><a href="product.html">产品统计</a></li>
				<li><a href="vip.html">大户分布</a></li>
				<li><a href="farmland.html">农田分布</a></li>
				<li><a href="agrinfo.html">农情分布</a></li>
				<li><a href="expert.html" class="click">专家风采</a></li>
				<li><a href="state.html">运行状态</a></li>
			</ul>
			<div class="login">
				<a href="javascript:void(0);" id="login">登录</a>
				<a href="javascript:void(0);" id="exit">退出登录</a>
			</div>
		</div>
		<!--main-container-part-->
		<div id="content">
			<!--breadcrumbs-->
			<div id="content-header">
				<div id="breadcrumb"> <a href="index.html" title="Go to Home" class="tip-bottom"><i class="icon-home"></i> 专家风采</a></div>
			</div>
			<div class="container-fluid" id="listContainer" style="overflow:auto;"></div>
			<div id="more" class="more">点击查看更多</div>
		</div>
		<div id="footer"> 2016 &copy; 重庆市气象局</div>
			<!--end-Footer-part-->
			<script src="js/excanvas.min.js"></script>
			<script src="js/jquery.min.js"></script>
			<script src="js/jquery.ui.custom.js"></script>
			<script src="js/bootstrap.min.js"></script>
			<script src="js/matrix.js"></script>
			<script src="libs/SuperMap.Include.js"></script>
			<script src="js/monitor.js"></script>
			<script src="js/WH.js"></script>
			<script type="text/javascript" src="js/jquery.cookie.js"></script>
			<script type="text/javascript" src="js/jquery.XYTipsWindow.2.8.js"></script>
			<script src="js/index.js"></script>
			<script type="text/javascript">
				$(document).ready(function() {
					var storage=window.localStorage;
					if (storage.boolea == 'false') {
						$("#login").show();
						$("#exit").hide();
						$("#login").click(function() {
							$.XYTipsWindow({
								___title: "登录",
								___content: "iframe:login.html",
								___width: "460",
								___height: "150",
								___showbg: true,
								___drag: "___boxTitle"
							});
						});
					} else {
						$("#login").hide();
						$("#exit").show();
						$("#exit").click(function() {
							monitor.loginout();
						});
					}
				})
				var monitor = new Monitor();
				var pager = null;
				monitor.getExpertCount(function(data) {
					//alert(JSON.stringify(data));
					//new Pager();
					pager = new Pager({
						recordCount: data[0]["c"]
					});
					monitor.getExperts(pager.sqlLimitFirst, pager.sqlLimitSecond, getExpertsDone);
				});
				$("#more").click(function() {
					if (pager) {
						if(pager.currentPageIndex>=pager.getPageCount()){
							$("#more").text('没有更多了');
							return;
						}	
						pager.next();
						monitor.getExperts(pager.sqlLimitFirst, pager.sqlLimitSecond, getExpertsDone);
					}
				});

				function getExpertsDone(data) {
					var html = "";
					for (var i = 0; i < data.length; i++) {
						if (i % 3 == 0) {
							if (i == 0) {
								html += "<div class=\"row-fluid\">";
							} else {
								html += "</div><div class=\"row-fluid\">";
							}
						}
						html += "<a class=\"aurl\" href='expertIfon.html?page="+ data[i]['id'] +"'>" + "<div class=\"informationss\">" + "<div class=\"question\">" + "<div class=\"portrait\">" + "<img src='http://183.230.183.18:8088/"+ data[i]['HeadImage'] +"' />" + "</div>" + "<div class=\"qcontent\">" + "<h5>姓名："+ data[i]['showname'] +"</h5>" + "<p><h>电话：</h>"+ data[i]['mobile'] +"</p>" + "<span>地区："+ data[i]['areaname'] +"</span>" + "</div>" + "</div>" + "</div>" + "</a>";


					}
					if (data.length > 0) {
						html += "</div>";
					}
					$("#listContainer").html($("#listContainer").html() + html);
				}

				setTimeout(function(){
					var bodyHd = $("body").height(),
						headHd = $(".header").height(),
						footHd = $("#footer").height(),
						brecHd = $("#breadcrumb").height(),
						moreHd = $(".more").height();
						console.log(bodyHd, headHd, footHd, brecHd, moreHd);
					$("#listContainer").css("height", bodyHd - headHd - footHd - brecHd - moreHd);
				}, 100);
			</script>
	</body>
</html>